#js-scroll {
  cursor: pointer;
}

.steps_wrap {
  margin: 16px 0;
}

.steps_wrap ol {
  display: flex;   flex-direction: column;   justify-content: center;
}

.steps_wrap ol > li {
  position: relative;  display: flex;   flex-grow: 1;   margin: 0;   padding: 10px;
}

.steps_wrap ol > li .step_content br {
  display: none;
}

.steps_wrap ol > li .step_number {
  font-size: 14px;   line-height: 26px;   position: absolute;   top: 50%;   left: 24px;  display: block;   box-sizing: border-box;   width: 26px;   height: 26px;   transform: translate(-50%, -50%);   text-align: center;   letter-spacing: 0;   border: solid 1px #edc8c7;   border-radius: 100%;   background-color: #fff;
}

.steps_wrap ol > li .step_content {
  font-size: 14px;   margin: auto auto auto 40px;  text-align: left;
}



.steps_wrap ol > li.current {
  /*background-color: #eecbca;*/
}

.steps_wrap ol > li.current .step_number {
  color: #d01027;   border-color: #eecbca;   background-color: #eecbca;
  ;
}

.steps_wrap ol > li.current .step_content {
  color: #2f2f2f;
}

.panel_content {
  max-width: 1000px;   margin: 50px auto 0;   background-color: #ffe8eb;
}

.panel_content .content_inner {
  padding: 20px 30px;
}

.panel_content .contentsLabel {
  font-size: 16px;   font-weight: bold;   margin-bottom: 10px;
}

.contents_login {
  display: flex;   align-items: flex-start;  max-width: 1000px;   margin: auto;   padding: 50px 0;
}

.contents_login .left_content {
  box-sizing: border-box;  width: 50%;
}

.contents_login .right_content {
  width: calc(50% + 20px);   margin: 0 0 0 20px;
}



.contents_login .right_content .signUpContent:nth-child(n+2) {
  margin-top: 20px;
}

.signUpContent {
  padding: 20px 30px;
}

.signUpContent .remindArea {
  margin-top: 16px;   margin-bottom: 0;   text-align: center;
}

.signUpContent.bg-gray {
  background-color: #f7f7f7;
}

.signUpContent.outerText {
  margin-top: 30px;
}

.signUpContent a {
  color: #d21d32;
}

.signUpContent .contentsLabel {
  display: block;
}

.signUpContent .button.button-long {
  line-height: 40px;  display: block;   max-width: inherit;   padding: 0 5px;
}

.signUpContent .contentInner:nth-child(n+2) {
  margin-top: 20px;
}

.contentInnerHeader p {
  margin-bottom: 10px;
}

.contentInnerFooter {
  margin-top: 10px;
}

.contentInner .remindBox:not(.login-page) {
  padding: 16px;   border-radius: 5px;  background-color: #fff;
}

.contentInner .remindBox > p {
  font-size: 14px;   margin-bottom: 0;
}

.contentInner ol > li {
  margin-top: 6px;
}

.signUpContent .attentionWords {
  color: rgb(140, 6, 14);
}

.contentInner .btnArea {
  margin: 16px auto;
}

.contentInner .btnArea:last-child {
  margin: 10px auto 0;
}

.contentInner li {
  margin-left: 24px;
}

.contentInner li.current_line {
  position: relative;   border-bottom: solid 1px #d01027;
}

.contentInner li.current_line::before,
.contentInner li.current_line::after {
  position: absolute;   top: 50%;  content: '';   border-radius: 100%;
}

.contentInner li.current_line::before {
  left: -24px;   width: 14px;   height: 14px;   margin-top: -8px;   border: 1px solid #d01027;  background: #fff;
}

.contentInner li.current_line::after {
  left: -20px;   width: 8px;   height: 8px;   margin-top: -4px;   background: #d01027;
}

.contentInner .agree_check {
  display: block;   padding: 8px 0;   text-align: left;
}

.contentInner .agree_check > .agree-checkbox {
  vertical-align: middle;
}

.signUpContent .btnArea {
  margin-top: 12px;
}

.btnArea > a.button-long ~ .btnDesc {
  max-width: 400px;   margin: auto;
}

.btnDesc {
  font-size: 12px;
}

.signUpContent .checkbox {
  box-sizing: border-box;  min-width: 200px;   cursor: pointer;
}

.signUpContent .checkbox .agree-checkbox {
  vertical-align: middle;
}

.btnArea a.u-yAxisPadding-15 {
  padding: 15px;
}

@media screen and (max-width: 640px) {
  .panel_content p,
  .signUpContent p,
  .signUpContent .checkbox,
  .signUpContent .agree-button,
  .signUpContent .button.button-long,
  .signUpContent .remindArea {
    font-size: 14px;
  }

  .signUpContent input {
    font-size: 14px;  padding: 12px 10px;
  }
  .signUpContent .contentsLabel {
    font-size: 20px;  padding-bottom: 0;
  }
  .signUpContent h3,
  .signUpContent h4 {
    font-size: 16px;     text-align: left;
  }

  .signUpContent .contentInner:nth-child(n+2) {
    margin-top: 40px;
  }

  .steps_wrap ol {
    flex-direction: column;
  }

  .steps_wrap ol > li {
    max-width: inherit;     margin-top: 0;
  }

  .panel_content {
    margin: 50px 20px 0;
  }

  .contents_login {
    display: block;     margin: 0 20px;
  }

  .contents_login .left_content {
    width: auto;
  }

  .contents_login .right_content {
    width: auto;     margin: 20px 0 0 0;
  }
}

.credit_confirm {
  display: none;   height: 100%;
}

.credit_confirm .modal_body {
  display: flex;   align-items: center;   justify-content: center;   box-sizing: border-box;   height: 100%;   padding: 10px;
}

.credit_confirm .modal_body .content {
  font-size: 16px;   font-weight: bold;   margin: auto;
}


.express-contents-label {
  font-size: 1.6rem;
  font-weight: bold;

  margin-bottom: 10px;
  padding-bottom: 5px;

  border-bottom: 1px solid #2899fa;
}

.express-button {
  background: #2899fa;
}

.express-button span {
  color: #fff;
}

.express-button-arrow:after {
  position: absolute;
  top: 50%;
  right: 20px;

  display: block;

  width: 8px;
  height: 8px;
  margin-top: -4px;

  content: '';
  transform: rotate(45deg);

  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
}
